<template>
	<view class="lff-components">
		<view style="height: 100upx;"></view>
		<view class="com-tabber">
			<view class="li" :class="{ 'on': url == 'index' }" @click="jRouter({path:'index',replace:'switchTab'})">
				<image src="/static/images/tabbar_icon/icon1-2.png" v-if="url == 'index'"></image>
				<image src="/static/images/tabbar_icon/icon1-1.png" v-else></image>
				<!-- <mIcon type="saishi" size="20" :color="url == 'index'?'#CA0000':'#999'"></mIcon> -->
				<view class="text">首页</view>
			</view>
			<view class="li" :class="{ 'on': url == 'storeIndex' }" @click="jRouter({path:'storeIndex',replace:'switchTab'})">
				<image src="/static/images/tabbar_icon/icon2-2.png" v-if="url == 'storeIndex'"></image>
				<image src="/static/images/tabbar_icon/icon2-1.png" v-else></image>
				<!-- <mIcon type="daka" size="20" :color="url == 'experienceIndex'?'#CA0000':'#999'"></mIcon> -->
				<view class="text">口碑好店</view>
			</view>
            <!-- jRouter({path:'homePageMy',replace:'redirectTo'}) -->
			<view class="li" :class="{ 'on': url == 'hotIndex' }" @click="jRouter({path:'hotIndex',replace:'switchTab'})">
				<image src="/static/images/tabbar_icon/icon3-2.png" v-if="url == 'hotIndex'"></image>
				<image src="/static/images/tabbar_icon/icon3-1.png" v-else></image>
				<!-- <mIcon type="daka" size="20" :color="url == 'experienceIndex'?'#CA0000':'#999'"></mIcon> -->
				<view class="text">新品热卖</view>
			</view>
            <view class="li" :class="{ 'on': url == 'mineIndex' }" @click="jRouter({path:'mineIndex',replace:'switchTab'})">
            	<image src="/static/images/tabbar_icon/icon4-2.png" v-if="url == 'mineIndex'"></image>
            	<image src="/static/images/tabbar_icon/icon4-1.png" v-else></image>
            	<!-- <mIcon type="daka" size="20" :color="url == 'experienceIndex'?'#CA0000':'#999'"></mIcon> -->
            	<view class="text">我的订单</view>
            </view>
		</view>
	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex';
	// import mIcon from '@/components/m-icon/m-icon.vue'
	export default {
		created() {
			let pages = getCurrentPages();
			let page = pages[pages.length - 1];
			this.$mUtils.rouName(page.route);
		},
		data() {
			return {
				url: uni.getStorageSync('redirect')
			}
		},
		computed: mapState({
			userInfo: 'userInfo'
		}),
        mounted(){
            
        },
        methods:{
            // 提示
            tip(){
                uni.showToast({
                    title: '功能暂未开放,敬请期待',
                    icon: 'none',
                    duration: 3000
                })
            }
        }
	};
</script>

<style lang="scss">
	.com-tabber {
		position: fixed;
		width: 100%;
		bottom: 0;
		z-index: 2;
		background: #fff;
		display: flex;
		justify-content: space-around;
		text-align: center;
		padding: 9upx 0 5upx 0;
		box-shadow: 0px -10upx 50upx rgba(44, 53, 68, 0.08);

		.li.on {
			.text {
				color:$main-color;
			}
		}

		.li {
			flex: 1 0 auto;

			image {
				width: 50upx;
				height: 50upx;
				position: relative;
				top: 5upx;
			}

			.text {
				font-size:24rpx;
				font-weight:bold;
				line-height:36rpx;
				color:$h6-color;
			}
		}
	}
</style>
